﻿@model DingTalkAgent.Model.T_CustomerDTO
@{
    ViewBag.Title = "Index";
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title style="color:#ffffff">客户管理</title>
    <meta name="HandheldFriendly" content="True">
    <meta name="MobileOptimized" content="320">
    <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no">
    <meta http-equiv="cleartype" content="on">
    <meta name="apple-mobile-web-app-capable" content="yes">
    <meta name="apple-mobile-web-app-status-bar-style" content="black">
    <meta name="apple-mobile-web-app-title" content="">
    <meta name="format-detection" content="telephone=no">
    <meta name="format-detection" content="email=no">
    @Html.Partial("_Common")
    <style type="text/css">
        form {
            margin: 0;
        }
        #search_box {
            width: 201px;
            height: 31px;
            margin-left:5px;
            background: url('../../../../dist/images/bg_search_box.gif');
        }
        #search_box #s {
            float: left;
            padding: 0;
            height:29px;
            /*margin: 6px 0 0 6px;*/
            padding-left:5px;
            /*padding-bottom:3px;*/
            border: 0;
            width: 159px;
            background: none;
            font-size:16px;
            line-height:29px;
        }
        #search_box #go {
            float: right;
            margin: 3px 4px 0 0;
        } 
    </style>
</head>
<body>
    <div id="search_box">
        <form id="search_form" method="post" onsubmit="return false" >
            <input type="text" name="key" id="s" class="swap_value" placeholder="客户名/电话" />
            <input type="image" src="../../../../dist/images/btn_search_box.gif" width="27" height="24" id="go" alt="Search" title="Search" />
        </form>
    </div> 
    <span style="float:right"><input class="mui-icon mui-icon-plusempty" style="z-index:90000;margin:0px;" id="btn_Add" type="button" value="新增" /></span>
    <div id="pullrefresh" style="margin-top:32px" class="mui-scroll-wrapper">
        <div class="mui-scroll">
            <ul class="mui-table-view">
                @if (Model.rows != null && Model.rows.Count > 0)
                {
                    foreach (var item in Model.rows)
                    {
                        <li class="mui-table-view-cell" onclick="openArchives(@item.id)">
                            <span class="mui-icon mui-icon-contact" style="font-size:18px;">&nbsp; @item.name</span><br />
                            <span class="mui-icon mui-icon-phone" style="font-size:18px;color:#54baf5">&nbsp; @item.telephone </span><br />
                            <span class="mui-icon mui-icon-home" style="font-size:14px;">&nbsp; @item.address</span>
                        </li>
                    }
                }
                else
                {
                    <li class="mui-table-view-cell">
                        <span class="mui-icon mui-icon-trash">没有相关数据！</span>
                    </li>
                }

            </ul>
        </div>
    </div>
    <script type="text/javascript" charset="utf-8">
        $("#btn_Add").click(function () {
            mui.openWindow({
                url: "/mobile/Customer/AddCustomer",
                id: "/mobile/Customer/AddCustomer",
                styles: {
                    top: 0,//新页面顶部位置
                    bottom: 0,//新页面底部位置
                    width: "600px",//新页面宽度，默认为100%
                    height: "700px",//新页面高度，默认为100%
                },
                extras: {

                },
                createNew: false,//是否重复创建同样id的webview，默认为false:不重复创建，直接显示
                show: {
                    autoShow: true,//页面loaded事件发生后自动显示，默认为true
                    aniShow: "slide-in-right",//页面显示动画，默认为”slide-in-right“；
                    duration: 150,//页面动画持续时间，Android平台默认100毫秒，iOS平台默认200毫秒；
                },
                waiting: {
                    autoShow: true,//自动显示等待框，默认为true
                    title: '正在加载...',//等待对话框上显示的提示内容
                    options: {
                        width: "500px",//等待框背景区域宽度，默认根据内容自动计算合适宽度
                        height: "600px",//等待框背景区域高度，默认根据内容自动计算合适高度
                    }
                }
            })

        })
        $("#go").click(function () {
            //if ($.trim($("#s").val()) != "") {
                $.ajax({
                    type: 'post',
                    url: "/Customer/GetCustomerList",
                    data: { page: 1, rows: 5, q: $.trim($("#s").val()) },
                    success: function (data) {
                        if (data == null || data.rows == null) {
                            return false;
                        }
                        $('.mui-table-view').empty();
                        var str = "";
                        $.each(data.rows, function (i, obj) {
                            str += '<li class="mui-table-view-cell" onclick="openArchives(' + obj.id + ')>'
                                      + '<span class="mui-icon mui-icon-contact" style="font-size:18px;">&nbsp; ' + obj.name + '</span><br />'
                                      + '<span class="mui-icon mui-icon-phone" style="font-size:18px;color:#54baf5">&nbsp; ' + obj.telephone + ' </span><br />'
                                      + '<span class="mui-icon mui-icon-home" style="font-size:14px;">&nbsp; ' + obj.address + '</span>'
                                  + '</li>';
                        });
                        $('.mui-table-view').append(str);
                    },
                    error: function () {
                        //请求出错处理
                    }
                });
            //}
        })
        mui.init({
            pullRefresh: {
                swipeBack: false, //关闭左滑关闭功能
                container: "#pullrefresh",//下拉刷新容器标识，querySelector能定位的css选择器均可，比如：id、.class等
                up: {
                    contentrefresh: '正在加载...',
                    contentnomore: '没有更多数据了',
                    callback: pulluploading //上拉加载下一页
                }

            },
        });
        var count = 2;
        function pulluploading() {
            setTimeout(function () {
                var data = {
                    page: count,
                    rows:5,
                    q: $.trim($("#s").val())
                };
                $.ajax({
                    type: 'post',
                    url: "/Customer/GetCustomerList",
                    data: data,
                    success: function (data) {
                        if (data == null || data.rows == null) {
                            mui('#pullrefresh').disablePullupToRefresh();
                            return false;
                        }
                        var str = "";
                        $.each(data.rows, function (i, obj) {
                            str += '<li class="mui-table-view-cell" onclick="openArchives(' + obj.id + ')>'
                                      + '<span class="mui-icon mui-icon-contact" style="font-size:18px;">&nbsp; ' + obj.name + '</span><br />'
                                      + '<span class="mui-icon mui-icon-phone" style="font-size:18px;color:#54baf5">&nbsp; ' + obj.telephone + ' </span><br />'
                                      + '<span class="mui-icon mui-icon-home" style="font-size:14px;">&nbsp; ' + obj.address + '</span>'
                                  + '</li>';
                        });
                        $('.mui-table-view').append(str);
                        if (count == data.total) {//总页码等于当前页码，停止上拉下拉
                            mui('#pullrefresh').pullRefresh().endPullupToRefresh(true);
                        } else {
                            count++;//翻下一页
                            mui('#pullrefresh').pullRefresh().refresh(true);
                            mui('#pullrefresh').pullRefresh().endPullupToRefresh(false);
                        }


                    },
                    error: function () {
                        //请求出错处理
                    }
                });
            }, 500);
        }

        function openArchives(id) {
            if (id) {
                window.location.href = '/mobile/Customer/Archives?customerId=' + id;
            }
        }
    </script>  
</body>
</html>
